<template xmlns:v-on="">
  <div style="background: #507cc0; width: 100%;float: none;margin: 0 auto;height: 60px;z-index: 1;" router="true">
    <el-menu
      :default-active="activeIndex"
      class="el-menu-demo"
      active-text-color="#fff"
      background-color="#507cc0"
      mode="horizontal" style="width: 70%;float: left; margin-left: 99px; height: 100%; background: rgb(80,124,192);" text-color="#fff">
      <router-link to="/" style="text-decoration:none "><el-menu-item index="1" style="margin: 0px;height: 50px;width: 100px">&nbsp{{module1}}</el-menu-item></router-link>
      <router-link to="/newAreaSurvey" style="text-decoration:none "> <el-menu-item index="2" style="padding-left: 8px;padding-right: 8px">{{module2}}</el-menu-item></router-link>
      <el-submenu index="3" popper-class="popper">
        <template slot="title">{{module3}}</template>
        <router-link to="/park/Yqgk" style="text-decoration:none "><el-menu-item index="3-1">{{module3_1}}</el-menu-item></router-link>
        <router-link to="/park/Zbpt" style="text-decoration:none "><el-menu-item index="3-2" v-on:click="">{{module3_2}}</el-menu-item></router-link>
        <router-link to="/park/Wzjjt" style="text-decoration:none "><el-menu-item index="3-3">{{module3_3}}</el-menu-item></router-link>
        <router-link to="/park/Lpfc" style="text-decoration:none "><el-menu-item index="3-4">{{module3_4}}</el-menu-item></router-link>
        <el-menu-item index="3-5">{{module3_5}}</el-menu-item>
        <router-link to="/park/Rzqy" style="text-decoration:none "> <el-menu-item index="3-6">{{module3_6}}</el-menu-item></router-link>
        <router-link to="/park/Dsj" style="text-decoration:none "> <el-menu-item index="3-7">{{module3_7}}</el-menu-item></router-link>
      </el-submenu>
      <el-submenu index="4">
        <template slot="title" style="height: 62px">{{module4}}</template>
        <router-link to="/zsyz" style="text-decoration:none "><el-menu-item index="4-1">{{module4_1}}</el-menu-item></router-link>
        <router-link to="/zsyz/investment" style="text-decoration:none "><el-menu-item index="4-2">{{module4_2}}</el-menu-item></router-link>
        <router-link to="/zsyz/policy" style="text-decoration:none "><el-menu-item index="4-3">{{module4_3}}</el-menu-item></router-link>
        <router-link to="/zsyz/procedure" style="text-decoration:none "><el-menu-item index="4-4">{{module4_4}}</el-menu-item></router-link>
        <router-link to="/zsyz/enter" style="text-decoration:none "><el-menu-item index="4-5">{{module4_5}}</el-menu-item></router-link>
        <router-link to="/zsyz/industry" style="text-decoration:none "><el-menu-item index="4-6">{{module4_6}}</el-menu-item></router-link>
      </el-submenu>
      <el-submenu index="5">
        <template slot="title">{{module5}}</template>
        <router-link to="/business" style="text-decoration:none "> <el-menu-item index="5-1">{{module5_1}}</el-menu-item></router-link>
        <router-link to="/internet" style="text-decoration:none "> <el-menu-item index="5-2">{{module5_2}}</el-menu-item></router-link>
        <router-link to="/culture" style="text-decoration:none "><el-menu-item index="5-3">{{module5_3}}</el-menu-item></router-link>
        <router-link to="/mobile" style="text-decoration:none "><el-menu-item index="5-4">{{module5_4}}</el-menu-item></router-link>
        <router-link to="tencent/" style="text-decoration:none "><el-menu-item index="5-5">{{module5_5}}</el-menu-item></router-link>
        <router-link to="/mobilehlw" style="text-decoration:none "><el-menu-item index="5-6">{{module5_6}}</el-menu-item></router-link>
        <router-link to="/mobilemeta" style="text-decoration:none "><el-menu-item index="5-7">{{module5_7}}</el-menu-item></router-link>
      </el-submenu>
      <el-submenu index="6">
        <template slot="title">{{module6}}</template>
        <router-link to="/yqfw/serviceInformation"><el-menu-item index="6-1">{{module6_1}}</el-menu-item></router-link>
        <router-link to="/yqfw/protal"> <el-menu-item index="6-2">{{module6_2}}</el-menu-item></router-link>
        <router-link to="/yqfw/LifeAndBasic"><el-menu-item index="6-3">{{module6_3}}</el-menu-item></router-link>
        <router-link to="/yqfw/enter"><el-menu-item index="6-4">{{module6_4}}</el-menu-item></router-link>
        <router-link to="/yqfw/investMentandFinancing"><el-menu-item index="6-5">{{module6_5}}</el-menu-item></router-link>
        <router-link to="/yqfw/personNeltraining"><el-menu-item index="6-6">{{module6_6}}</el-menu-item></router-link>
        <router-link to="/yqfw/technicalAndNetwork"><el-menu-item index="6-7">{{module6_7}}</el-menu-item></router-link>
      </el-submenu>
      <el-submenu index="7">
        <template slot="title">{{module7}}</template>
        <router-link :to="{path:'/parkNews',query:{informationType:'园区新闻'}}"><el-menu-item index="7-1">{{module7_1}}</el-menu-item></router-link>
        <router-link :to="{path:'/parkNews',query:{informationType:'园区公告'}}"><el-menu-item index="7-2">{{module7_2}}</el-menu-item></router-link>
        <router-link :to="{path:'/parkNews',query:{informationType:'园区活动'}}"><el-menu-item index="7-3">{{module7_3}}</el-menu-item></router-link>
        <router-link :to="{path:'/parkNews',query:{informationType:'园区政策'}}"><el-menu-item index="7-4">{{module7_4}}</el-menu-item></router-link>
      </el-submenu>
<<<<<<< HEAD
      <router-link to="userCenter"><el-menu-item index="8">{{module8}}</el-menu-item></router-link>
=======
      <router-link to="/userCenter" style="text-decoration:none "> <el-menu-item index="2" style="padding-left: 8px;padding-right: 8px">{{module8}}</el-menu-item></router-link>
>>>>>>> mh_ui/master

    </el-menu>
  </div>
</template>

<script>

  export default {
    name: 'navigation',
    data() {
      return {
        activeIndex: '1',
        module1:'首页',
        module2:'两江新区概况',
        module3:'园区概览',
        module3_1:'园区概况',
        module3_2:'周边配套',
        module3_3:'位置及交通',
        module3_4:'楼盘风采',
        module3_5:'3D导览',
        module3_6:'入驻企业',
        module3_7:'大事记',
        module4:'招商引资',
        module4_1:'招商引资',
        module4_2:'投资环境',
        module4_3:'政策优势',
        module4_4:'入驻流程',
        module4_5:'我要入驻',
        module4_6:'产业优势',
        module5:'众创空间',
        module5_1:'创业从一杯咖啡开始',
        module5_2:'互联网金融众创空间',
        module5_3:'文化创意众创空间',
        module5_4:'移动游戏众创空间',
        module5_5:'腾讯（重庆）众创空间',
        module5_6:'移动互联网众创空间',
        module5_7:'移动新媒体众创空间',
        module6:'园区服务',
        module6_1:'园区服务',
        module6_2:'我要服务',
        module6_3:'生活配套',
        module6_4:'我要入驻',
        module6_5:'我要融资',
        module6_6:'人才服务',
        module6_7:'技术支持',
        module7:'园区资讯',
        module7_1:'园区新闻 ',
        module7_2:'园区公告',
        module7_3:'园区活动',
        module7_4:'园区政策',
        module8:'客服中心'

      };
    },
    methods:{

    }

  }
</script>

<style lang="scss">
  .el-submenu__title{
    height: 50px !important;
    width: 100px !important;
  }
  .el-menu.el-menu--horizontal {
    height: 50px;
    display: flex;
    justify-content: center;
    border-bottom: none !important;
  }
  .el-menu--horizontal>.el-menu-item.is-active {
    height: 50px;
    border-bottom: none !important;
  }
  .el-menu--horizontal>.el-submenu {
     height: 50px !important;
   }
  .el-menu--horizontal>.el-menu-item {
    height: 50px !important;
  }
  .el-menu--horizontal>
  .el-submenu.template {
    height: 50px !important;
  }
  /*如果加上scoped，以下代码会失效*/
  .el-menu--horizontal>.el-submenu .el-submenu__icon-arrow {
    display: none !important;
  }
  .el-submenu.is-opened>.el-submenu__title .el-submenu__icon-arrow {
    display: none !important;
  }
  .el-menu--popup-bottom-start {
    margin-top: 0 !important;
  }
  .el-menu--popup {
    padding: 0 !important;
    min-width: 100px;
    opacity: 0.7;
    text-align: center;
    background-color: rgb(143,143,143);
  }

  .el-menu-item{
    height: 50px !important;
  }
  .el-submenu__title{
    height: 50px !important;
    border-bottom: 0px !important;
  }
i{
    text-decoration: none;
  }
</style>
